import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';

import 'KaL_Config.dart';

class FLBallsView extends StatefulWidget {
  FLBallsView({
    super.key,
    required this.balls,
    this.alignment = WrapAlignment.center,
  });
  List balls;
  WrapAlignment? alignment;
  @override
  State<FLBallsView> createState() => _FLBallsViewState();
}

class _FLBallsViewState extends State<FLBallsView> {
  ///
  double ballWH = 34;
  late var _numbers = [];
  List<Widget> _balls = [];

  @override
  void initState() {
    // TODO: implement initState
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    _balls.clear();
    _numbers = widget.balls;
    for (var element in _numbers) {
      bool _isRegular = element['isRegular'];
      var number = element['number'];
      if (_isRegular) {
        _balls.add(regularBall(number));
      } else {
        _balls.add(extramBall(number));
      }
    }

    return Container(
      padding: EdgeInsets.only(left: 6, right: 6),
      // padding: const EdgeInsets.all(6),
      // width: 320,
      // color: Colors.green,
      child: Column(
        // crossAxisAlignment: CrossAxisAlignment.center,
        mainAxisAlignment: MainAxisAlignment.center, // 垂直居中
        children: [
          Wrap(
            alignment: widget.alignment!,
            spacing: 8.0,
            runSpacing: 6.0,
            children: _balls,
          )
        ],
      ),
    );
  }

  Widget regularBall(String number) {
    return Container(
      // color: Colors.white,
      width: ballWH,
      height: ballWH,
      // padding: const EdgeInsets.all(2),
      child: Container(
        // padding: const EdgeInsets.all(2),
        decoration: BoxDecoration(
            color: KaL_Config.KaL_MainColor,
            borderRadius: BorderRadius.all(Radius.circular(ballWH * 0.5))),
        child: Center(
          child: Text(
            number,
            style: const TextStyle(
              fontWeight: FontWeight.w600,
              fontSize: 14,
              color: Colors.white,
            ),
          ),
        ),
      ),
    );
  }

  Widget extramBall(String number) {
    return Container(
      // color: Colors.white,
      width: ballWH,
      height: ballWH,
      // padding: const EdgeInsets.all(2),
      child: Container(
        // alignment: Alignment.center,
        // padding: const EdgeInsets.only(top: 3),
        decoration: BoxDecoration(
            color: KaL_Config.KaL_extramNumColor,
            borderRadius: BorderRadius.all(Radius.circular(ballWH * 0.5)),
            border: Border.all(
              width: 2,
              color: KaL_Config.KaL_extramNumBoardColor,
            )),
        // child: Text(
        //   number,
        //   style: const TextStyle(
        //     fontWeight: FontWeight.w600,
        //     fontSize: 14,
        //     color: Colors.white,
        //   ),
        // ),
        child: Center(
          child: Text(
            number,
            style: TextStyle(
              fontWeight: FontWeight.w600,
              fontSize: 14,
              color: KaL_Config.KaL_extramNumTitleColor,
            ),
          ),
        ),
      ),
    );
  }
}
